<script src="./sign.js"></script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style src="./sign.less" lang="less" scoped></style>

<template>
  <div class="sign">
      <div class="head">
          <img src="~assets/img/sign-bg.jpg" alt="">
      </div>
      <div class="content">
          <div class="title">
              <div class="line"></div>
              <h1>请填写相关资料提交</h1>
              <div class="line"></div>
          </div>
          <div class="group">
              <input type="text" v-model="user.name" maxlength="20" placeholder="输入您的姓名">
          </div>
          <div class="group">
              <input type="tel" v-model="user.age" maxlength="2" placeholder="输入您的年龄">
          </div>
          <div class="group">
              <input type="text" v-model="user.pro" maxlength="20" placeholder="输入您的职业">
          </div>
          <div class="group">
              <input type="text" v-model="user.degree" maxlength="20" placeholder="眼睛状况（近视度数、散光、远视）">
          </div>
          <div class="group">
              <input type="tel" v-model="user.tel" maxlength="11" placeholder="手机号（不对外公开）">
          </div>
          <div class="group">
              <textarea v-model="user.declaration" placeholder="参赛宣言（一句话证明我有近视）"></textarea>
          </div>
          <div class="upImg">
              <!--<div class="btn">点击上传图片</div>-->
              <vue-core-image-upload
                      v-bind:class="['pure-button','pure-button-primary','js-btn-crop']"
                      v-bind:crop="false" url="/index.php?s=/Upload/uploadCommon&channel=deshijia"
                      extensions="png,gif,jpeg,jpg"
                      text="点击上传图片"
                      v-on:imageuploaded="imageuploaded"
                      v-on:imagechanged="imagechanged">
              </vue-core-image-upload>
              <div class="img">
                  <img class="pic" v-if="user.img&&!imgload" v-bind:src="user.img" alt="">
                  <div class="imgLoad" v-if="imgload">
                      <img src="~assets/img/refresh.png" alt="">
                  </div>
              </div>
          </div>
          <div class="submitBtn c-btn" @click="submitSign()">提交报名</div>
      </div>
      <!--提示框-->
      <div class="prompt animated tada" v-show="prompt">
          <p>{{prompt}}</p>
      </div>

      <my-component ref="alerts"></my-component>
  </div>
</template>
